<!DOCTYPE html>
<html>
    <head>
        <script src="../resources/js-test.js"></script>
    </head>
    <body>

        <input id="empty_colorwell" type="color">
        <input id="valid_colorwell" type="color" value="#ff0000">
        <input id="invalid_colorwell" type="color" value="purple">
     
        <script>
            description("This test ensures that the correct accessibility properties can be retrieved from input elements of type color.");

            if (window.accessibilityController) {
                var colorwell = document.getElementById("empty_colorwell");
                colorwell.focus();
                var axColorwell = accessibilityController.focusedElement;
                shouldBeEqualToString("axColorwell.role", "AXRole: AXColorWell");
                shouldBeEqualToNumber("axColorwell.colorValue", 0xff000000);
                shouldBeEqualToString("axColorwell.stringValue", "AXValue: rgba(0, 0, 0, 1)");

                colorwell = document.getElementById("valid_colorwell");
                colorwell.focus();
                axColorwell = accessibilityController.focusedElement;
                shouldBeEqualToString("axColorwell.role", "AXRole: AXColorWell");
                shouldBeEqualToNumber("axColorwell.colorValue", 0xffff0000);
                shouldBeEqualToString("axColorwell.stringValue", "AXValue: rgba(255, 0, 0, 1)");

                colorwell = document.getElementById("invalid_colorwell");
                colorwell.focus();
                axColorwell = accessibilityController.focusedElement;
                shouldBeEqualToString("axColorwell.role", "AXRole: AXColorWell");
                shouldBeEqualToNumber("axColorwell.colorValue", 0xff000000);
                shouldBeEqualToString("axColorwell.stringValue", "AXValue: rgba(0, 0, 0, 1)");
            }

        </script>
    </body>
</html>
